Elementor is the main option for WordPress users who put design on the emphasis. It allows you to create a beautiful website in a visual way without needing to deal with either CSS or HTML. When working with Elementor, you might experience some errors like the widgets panel not working or the editor can’t load. We have summarized the most common Elementor errors and show you the list in this article. Each error is also added the solution how fix it.

Elementor comes with a centralized panel which lies on the left side of the editor. You can use the panel to add a widget, set the basic settings (e.g., setting up the page layout), make the customizations to a widget, and so on. On certain moments, you might be unable to add a new widget as the widgets cannot be loaded. This error usually happens when you have too many Elementor add-ons activated. Another possible error cause is that your hosting specs don’t meet the minimum requirements of Elementor.

How to fix the error:

There are at least two ways to fix the error type above. First, you can temporarily deactivate the installed WordPress plugins (except Elementor) to find which plugin causing the error. Particularly, you can deactivate the active Elementor add-ons. Second, you can switch to another theme. Temporarily switching to a default WordPress theme (e.g., Twenty Seventeen) would be great. You can read our previous article to learn more about how to fix this error type.

Elementor Pro comes with a widget — the Form widget — to allow you to create a form. You can use the Form widget to create any type of form, including a contact form. The common error when creating a contact form in Elementor is that the form data is not sent. The error usually happens when you set the form action to email.

How to fix the error:

Just like other form builder plugins, Elementor also uses the wp_mail function as the mail delivery service. The wp_mail function itself depends on send_mail belongs to PHP to work. The problem is, not all hosting providers enable this function. Thus, you need to ask your hosting provider to enable the send_mail function to make the wp_mail function work. Alternatively, you can use a custom SMTP service on your WordPress site. You can read our previous article to learn more about how to fix the form not sent error in Elementor.

The Posts widget of Elementor allows you to display blog posts on your WordPress site on any page. It comes with some setting options, including the excerpt length. On some cases, the length of the excerpt doesn’t appear as you have set when you preview or publish the page. The error usually happens when you use Elementor on WordPress themes that have a built-in setting option to set the excerpt length.

How to fix the error:

Instead of setting the excerpt length via Elementor settings panel, you can set the excerpt length via theme customizer (Appearance -> Customize). You can read our previous article to learn more.

This error type is similar to error number one above, but a bit more fatal. All you see is a preloader on a grey page. There are some causes that trigger the error. One of which is insufficient server resource caused by too many loads.

How to fix the error:

There are some alternatives you can try to fix the error.

One of the causes of this error type is a conflict between Elementor and another plugin. Thus, you can deactivate the plugins — except Elementor, of course — to find out which plugin causing the conflict.

Some WordPress themes come with a default preloader. If you use a theme that has a default preloader, you may need to disable it in order for Elementor editor to open.

Sometimes, the error type is caused by an extension installed on your web browser. To figure it out, you can use a different web browser. If the Elementor editor opens normally on another browser, you can disable extensions on your main browser to figure out which one causing the error.

If you use both Elementor Free and Elementor Pro (read: Elementor Free vs Elementor Pro), make sure they are compatible. If you use one older than another, this can cause the incompatibility. When updating Elementor Free, make sure you also update Elementor Pro version when available — and vice versa.

Another common error you might experience when working with Elementor is 500 internal server error. When you face this error, the error is on your server side instead of Elementor. There are several causes that trigger this error type. It can be PHP memory limit, wrong file permissions, corrupted .htaccess file, browser cache, corrupted database, and so on.

How to fix the error:

As mentioned above, there are a wide range of scenarios that cause the 500 internal server error. Thus, you can fix error according to the error cause. If the cause is PHP memory limit, you can ask your hosting provider to increase the PHP memory limit. You can refer to this page to learn more about the 500 internal server error in WordPress.

Elementor has a visual editor that comes with a live editor. Meaning that what you see on the editor will look precisely the same on the live page. However, there is a scenario where the stylings you applied on the editor are not applied on the live page. This error is usually caused by caching issue.

How to fix the error:

You have learned the error cause — caching. So, you can fix the error by clearing the cache on your web browser. If you have a caching plugin on your WordPress site, you can also temporarily deactivate it.

If the method above doesn’t work, you can regenerate CSS. To do so, go to Elementor -> Tools on your WordPress dashboard. Click the Regenerate Files & Data button.

You can also combine the two methods above.

Once you are done editing a page with Elementor, you can click the Publish/Update button on the bottom side of the settings panel to publish/update your page. What if the button doesn’t work?

There are two main reasons to cause the publish/update button doesn’t work in Elementor. First, it can be memory limit. Second, it can be security issue.

How to fix the error:

In order to make Elementor work properly on your WordPress site, your server needs to have at least 128 MB of PHP memory limit, with 256 MB or higher is more recommended. If your hosting provider only offers 128 MB of PHP memory limit, you can make a request to increase it.

Today, most websites have used SSL (HTTPS). In case you haven’t used one, you can install it on your WordPress site. Most hosting provider offer SSL as a default feature. If your hosting provider uses cPanel, you can install SSL via cPanel.

The custom CSS feature offered by Elementor Pro allows you to achieve certain stylings that are not offered by Elementorby default. Normally, after you add a custom CSS code, the change is applied to the live page once you publish/update the page. If not, there might be caching issue on your website.

How to fix the error:

Same as error number six above, you can clear the cache to fix this error type. You can clear the cache of both your web browser and your website. Before doing so, you can regenerate CSS as shown on number six above.

In Elementor, there are two widgets to add text elements to a page — the Text Editor widget and the Heading widget. When working with these widgets (and other widgets that have options to customize the text), you can set the text color. In some cases, the text color doesn’t work on the live page.

How to fix the error:

If you have set the text color, yet it is not applied on the live page, chances are there is a conflict between Elementor and the theme you use. Some WordPress themes come with advanced setting options to control the colors of your site elements, including the text. To fix the conflict, you can reset the color settings of your theme in order for the Elementor styles to take effect. You can do so from theme customizer (Appearance -> Customize) or the settings panel of your theme if it has one.

If you use Elementor Pro, you can customize every single part of your WordPress site in a visual way thanks to theme builder feature. From the header, footer, archive pages, single post, single page, 404 page, search results page, and so on. Some Elementor add-ons (e.g., JetThemeCore) also have similar feature. If you have created a certain custom template using Elementor theme builder (e.g., custom header template) and install JetThemeCore, there is a big chance that your custom template won’t work.

How to fix the error:

If you use JetThemeCore, you can install JetThemeCore Compatibility Kit. It is a WordPress plugin developed by Crocoblock to overcome the incompatibility issue between Elementor theme builder and JetThemeCore.

The ability to add custom fields is another feature offered by Elementor Pro. You can make use of this feature to create a complex dynamic website. Elementor itself supports popular custom field plugins like ACF, Pods, Meta Box, Toolset, to JetEngine. When trying to add a custom field in Elementor, you might face a problem whereby the custom field data doesn’t appear on the canvas area of the Elementor editor.

How to fix the error:

One thing you need to know first. Custom fields can only be added to a custom template (e.g., custom single post template). You can’t add a custom field to a regular page.

If you have added a custom field to a custom template but the associated custom field doesn’t appear, you can change the preview setting. Click the gear icon on the bottom-left corner and open the Preview Settings block. Select the content type associated with the custom template you are working on and select an existing content. Click the APPLY & PREVIEW button.

You can read our previous article to learn more about how to fix this error type.

You have known it. That Elementor is the most popular page builder plugin for WordPress. There are some common errors experienced by Elementor users as we have mentioned above. Before you install Elementor on your WordPress site, you can make sure that the specs of your hosting meet the minimum requirements demanded by Elementor to minimize the error when working with Elementor. Here are the system requirements of Elementor:

Although Elementor supports add-ons to extend its functionality, you better install an add-on only when you really need it. This can also minimize the error potential as each add-on you install consumes server resource. Another thing to notice. Make sure to install one page builder plugin on your WordPress site as installing two or more page builder plugins can cause a conflict.